<template>
  <div>
    <div class="pageTitleWhole">
      <a-breadcrumb>
        <a-breadcrumb-item>禁区报备审核</a-breadcrumb-item>
      </a-breadcrumb>
    </div>
    <div class="pageContentWhole">
      <a-form layout="inline">
        <a-form-item label="公司编号">
          <a-input v-model="searchForm.truckOrderCode"></a-input>
        </a-form-item>
        <a-form-item label="状态">
          <a-select v-model="searchForm.status" class="selectWidth">
            <a-select-option key>全部</a-select-option>
            <a-select-option :key="1">待审核</a-select-option>
            <a-select-option :key="2">审核通过</a-select-option>
            <a-select-option :key="3">审核不通过</a-select-option>
          </a-select>
        </a-form-item>
        <a-form-item label="上报日期">
          <a-range-picker @change="dateChange"></a-range-picker>
        </a-form-item>

        <a-form-item>
          <a-button type="primary" @click="handleSubmit1">查询</a-button>
        </a-form-item>
        <a-form-item>
          <a-button type="primary" @click="exportExcel">导出excel</a-button>
        </a-form-item>
      </a-form>

      <a-table :loading="loading" :columns="columns" :dataSource="tableData" :pagination="pagination" rowKey="penaltyAreaId" class="tableMargin">
        <template slot="code" slot-scope="text, record">
          <a :href="`/landCenter/orderDispatch/${record.orderTruckId}`" target="_blank">{{text}}</a>
        </template>
        <template slot="opt" slot-scope="text, record">
          <a v-if="record.status===1" type="primary" @click="auditIt(record.penaltyAreaId)">审核</a>
          <a v-else type="primary" @click="detailIt(record.penaltyAreaId)">详情</a>
        </template>
      </a-table>
    </div>

    <detail :visible="visible" :id="id" @setVisible="setVisible"/>
  </div>
</template>

<script>
import {queryAuditTruckPenaltyAreaList} from '@/api/landCenter'
import {commonExport} from '@/api/request'
import detail from './detail'
export default {
  data () {
    const columns = [
      {
        title: '公司编号',
        dataIndex: 'truckOrderCode',
        scopedSlots: {customRender: 'code'}
      },
      {
        title: '车辆',
        dataIndex: 'tractorNumber'
      },
      {
        title: '司机',
        dataIndex: 'driverName'
      },
      {
        title: '所在位置',
        dataIndex: 'lbsName'
      },
      {
        title: '状态',
        dataIndex: 'status',
        customRender: (text, record) => {
          return text === 1 ? '待审核' : (text === 2 ? '审核通过' : (text === 3 ? '审核不通过' : ''))
        },
        _needName: true
      },
      {
        title: '上报时间',
        dataIndex: 'createTime'
      },
      {
        title: '操作',
        scopedSlots: {customRender: 'opt'}
      }
    ]

    return {
      searchForm: {
        truckOrderCode: '',
        status: '',
        time1: '',
        time2: ''
      },
      tableData: [],
      columns,
      loading: false,
      pagination: {},
      pageNum: 1,
      pageSize: 10,
      // modal
      visible: false,
      id: null
    }
  },
  components: {
    detail
  },
  methods: {
    dateChange (date, dataStr) {
      this.searchForm.time1 = dataStr[0]
      this.searchForm.time2 = dataStr[1]
    },
    handleSubmit1 () {
      this.pageNum = 1
      this.handleSubmit()
    },
    handleSubmit () {
      this.loading = true
      queryAuditTruckPenaltyAreaList({
        ...this.searchForm,
        pageNum: this.pageNum,
        pageSize: this.pageSize
      }).then(rsp => {
        this.loading = false
        this.tableData = rsp.data.list
        this.pagination = {
          current: this.pageNum,
          pageSize: rsp.data.pageSize,
          total: rsp.data.total,
          showQuickJumper: false,
          showSizeChanger: true,
          showTotal: total => `共${total}条记录 第${this.pageNum}/${rsp.data.pages}页`,
          onChange: pageNum => {
            this.pageNum = pageNum
            this.handleSubmit()
          },
          onShowSizeChange: (current, size) => {
            this.pageNum = current
            this.pageSize = size
            this.handleSubmit()
          }
        }
      }).catch(() => { this.loading = false })
    },
    exportExcel () {
      commonExport('/truckOrder/exportAuditTruckPenaltyAreaList', {
        ...this.searchForm,
        pageNum: this.pageNum,
        pageSize: this.pageSize,
        columns: this.columns
      })
    },
    auditIt (id) {
      if (!this.$root._bc.audit) {
        this.$message.error('您无此权限！')
        return
      }
      this.id = id
      this.visible = true
    },
    detailIt (id) {
      this.id = id
      this.visible = true
    },
    setVisible (d) {
      if (d) {
        this.handleSubmit()
      }
      this.visible = false
    }
  },
  mounted () {
    this.handleSubmit()
  }
}
</script>
